<template>
  <a-config-provider :locale="zh_CN">
    <router-view />
  </a-config-provider>
  <!-- <div class="main">     
    <div id="meta2d"></div>  
  </div> -->
</template>

<script setup lang="ts">
  import "dayjs/locale/zh-cn";
  import zh_CN from "ant-design-vue/lib/locale/zh_CN";

// import { ref, onMounted, onUnmounted} from 'vue'; 
// import { Meta2d } from '@meta2d/core'; 
// import { flowPens, flowAnchors } from '@meta2d/flow-diagram';  //流程图
// import { activityDiagram, activityDiagramByCtx } from '@meta2d/activity-diagram'; //活动图
// import { classPens } from '@meta2d/class-diagram';  //类图
// import {
//   sequencePens,
//   sequencePensbyCtx
// } from '@meta2d/sequence-diagram'; //序列图
// import { formPens } from '@meta2d/form-diagram'; //形状图
// import { chartsPens } from '@meta2d/le5le-charts'; //图表
// import { ftaPens, ftaPensbyCtx, ftaAnchors } from '@meta2d/fta-diagram'; 


// // import json from "./demo.json";
// // import json2 from "./demo2.json";
// // import demos1 from "./demos1.json";
// // import demos2 from "./demos2.json";
// import combinedState from "./combinedState1.json";




// // console.log('json', json)

//     // const meta2dOptions: Options = {};  
//     const meta2d = ref();
//     // const meta2d = new Meta2d("meta2d")
//     onMounted(() => {       
//       meta2d.value = new Meta2d("meta2d")
//       // new Meta2d('meta2d', meta2dOptions);  
//       meta2d.value.register(flowPens());    
//       meta2d.value.register(activityDiagram());  
//       meta2d.value.register(classPens());    
//       meta2d.value.register(sequencePens()); 
//       meta2d.value.registerCanvasDraw(sequencePensbyCtx());    
//       meta2d.value.registerCanvasDraw(formPens());
      
//       meta2d.value.registerAnchors(flowAnchors());
//       meta2d.value.registerCanvasDraw(activityDiagramByCtx());
//       meta2d.value.registerCanvasDraw(chartsPens());
//       meta2d.value.register(ftaPens());
//       meta2d.value.registerCanvasDraw(ftaPensbyCtx());
//       meta2d.value.registerAnchors(ftaAnchors());



//       // 监听消息事件       
//       meta2d.value.on('contextmenu', contextmenu);      
//       meta2d.value.on('click', click);            
//       // 打开文件            
//       // meta2d.value.open(json); 
//       // meta2d.value.open(json2); 
//       // meta2d.value.open(demos1); 
//       // meta2d.value.open(demos2);
//       meta2d.value.open(combinedState); 

//       // meta2d.value.store.data.mqtt = params.mqtt;
//       // meta2d.value.store.data.mqttTopics = params.mqttTopics;
//       // meta2d.value.store.data.mqttOptions = params.mqttOptions;
//       // meta2d.value.connectMqtt();




//       // const meta2d = new Meta2d("meta2d")
//       // const pen = {
//       //   name: "rectangle",
//       //   text: "矩形",
//       //   x: 100,
//       //   y: 100,
//       //   width: 100,
//       //   height: 100,
//       // };

//       // meta2d.value.addPen(pen);      
//     });     
//     onUnmounted(() => {    
//       if (meta2d.value) {      
//         meta2d.value.off('contextmenu', contextmenu);      
//         meta2d.value.off('click', click);      
//         meta2d.value.destroy();          
//       }       
//     });        
//     const contextMenuVisible = ref(false);   
//     const contextmenu = () => {    
//       contextMenuVisible.value = true;       
//     }        
//     const click = () => {      
//       contextMenuVisible.value = false;   
//     } 
</script>

<style scoped>
.main, #meta2d{
  width: 100%;
  height: 100%;
}
</style>
